<template>
  <div id="cqd">
    <el-row>
      <el-table v-if="zbjcdata.name=='带班领导巡检不达标'" :data="table.data">
        <el-table-column type="index" label="序号" width="70"></el-table-column>
        <el-table-column prop="sf" label="省份" show-overflow-tooltip></el-table-column>
        <el-table-column prop="mkmc" label="煤矿名称"  show-overflow-tooltip></el-table-column>
        <el-table-column prop="zbyf" label="值班月份" show-overflow-tooltip></el-table-column>
        <el-table-column prop="dbld" label="带班领导" show-overflow-tooltip></el-table-column>
        <el-table-column prop="zw" label="职务" show-overflow-tooltip></el-table-column>
        <el-table-column prop="qjdd" min-width="300" label="缺检地点"></el-table-column>
      </el-table>

      <el-table v-if="zbjcdata.name=='领导带班未巡检'" :data="table.data1">
        <el-table-column type="index" label="序号" width="70"></el-table-column>
        <el-table-column prop="sf" label="省份" show-overflow-tooltip></el-table-column>
        <el-table-column prop="mkmc" label="煤矿名称"  show-overflow-tooltip></el-table-column>
        <el-table-column prop="dbld" label="带班领导" show-overflow-tooltip></el-table-column>
        <el-table-column prop="intime" label="入井时间" show-overflow-tooltip></el-table-column>
        <el-table-column prop="outtime" label="出井时间" show-overflow-tooltip></el-table-column>
        <el-table-column prop="geshu" min-width="110" label="值班途径分站数（个）" show-overflow-tooltip></el-table-column>
        <el-table-column label="操作" show-overflow-tooltip>
           <template v-slot:default="{ row }">
                <el-link type="primary" @click="openDetail(row)">详情</el-link>
            </template>
        </el-table-column>
      </el-table>

      <el-table v-if="zbjcdata.name=='疑似领导代班'" :data="table.data2">
        <el-table-column type="index" label="序号" width="70"></el-table-column>
        <el-table-column prop="sf" label="省份" show-overflow-tooltip></el-table-column>
        <el-table-column prop="mkmc" label="煤矿名称"  show-overflow-tooltip></el-table-column>
        <el-table-column prop="dbld" label="疑似代班领导" show-overflow-tooltip></el-table-column>
        <el-table-column prop="dbry" label="疑似代班人员" show-overflow-tooltip></el-table-column>
        <el-table-column prop="intime" label="入井时间" show-overflow-tooltip></el-table-column>
        <el-table-column prop="outtime" label="出井时间" show-overflow-tooltip></el-table-column>
        <el-table-column label="详情" show-overflow-tooltip>
          <template v-slot:default="{ row }">
            <el-link type="primary" @click="openDetail(row)">详情</el-link>
          </template>
        </el-table-column>
      </el-table>
    </el-row>
    <!-- 分页信息栏 -->
    <el-row class="pagination-bar">
      <el-col :span="8" class="page-info">显示第&nbsp;{{currentStart}}&nbsp;至&nbsp;{{currentEnd}}&nbsp;项结果，共&nbsp;{{table.total}}&nbsp;项</el-col>
      <el-col :span="16" class="text-right">
        <el-pagination
          layout="prev,pager,next,jumper"
          :total="table.total"
          :current-page.sync="table.currentPage"
          :page-size="table.pageSize"
          @current-change="initData"
        ></el-pagination>
      </el-col>
    </el-row>
    <local-dialog
      :title="diaDetail.title"
      width="80%"
      :visible.sync="diaDetail.show"
      :close-on-click-modal="false"
      v-if="diaDetail.show">
      <zbjcDetail :zbjcdata="diaDetail" v-if="diaDetail.show"></zbjcDetail>
      </local-dialog>
  </div>
</template>

<script>
import zbjcDetail from "./zbjcDetail.vue"
export default {
  components: {zbjcDetail},
  props: {
    zbjcdata: {
      type: Object,
      default: {}
    }
  },
  data() {
    return {
      table: {
        data: [
          {
           sf:"贵州省",
           mkmc:"新安煤矿",
           zbyf:"2021年6月",
           dbld:"陈靖",
           zw:"机电副矿长",
           qjdd:"14区充电硐室、南翼第二变电所"
          },
          {
           sf:"安徽省",
           mkmc:"顾北煤矿",
           zbyf:"2021年6月",
           dbld:"庞学文",
           zw:"防突副矿长",
           qjdd:"1113底抽巷措施巷、1111底抽巷无极绳绞车处、1111-1工作面下隅角"
          },
          {
           sf:"宁夏省",
           mkmc:"丁家梁煤矿",
           zbyf:"2021年6月",
           dbld:"刘振波",
           zw:"地测副总工程师",
           qjdd:"12240上巷防冲区、2区临时瓦斯抽放泵站、12采区1号变电所"
          },
          {
           sf:"云南省",
           mkmc:"宏发煤矿",
           zbyf:"2021年6月",
           dbld:"马守峰",
           zw:"机电副总工程师",
           qjdd:"23采区皮带机头联巷、2301下底板巷风门、第1中部车场回风、-350水仓"
          }
        ], //数据
        data1: [
          {
           sf:"贵州省",
           mkmc:"大安煤矿",
           dbld:"侯亚军",
           intime:"2021/7/9 21:51:22",
           outtime:"2021/7/10 11:00:31",
           geshu:"6",
          },
          {
           sf:"安徽省",
           mkmc:"顾北煤矿",
           dbld:"崔建华",
           intime:"2021/7/9 22:16:18",
           outtime:"2021/7/10 11:09:49",
           geshu:"4",
          },
          {
           sf:"宁夏省",
           mkmc:"丁家梁煤矿",
           dbld:"孙小生",
           intime:"2021/7/9 22:31:51",
           outtime:"2021/7/10 11:15:57",
           geshu:"5",
          },
        ],
        data2: [
          {
           sf:"贵州省",
           mkmc:"永安煤矿",
           dbld:"康国峰",
           dbry:"李柱",
           intime:"2021/7/9 21:51:22",
           outtime:"2021/7/10 11:00:31",
          },
          {
           sf:"安徽省",
           mkmc:"潘三煤矿",
           dbld:"张月明",
           dbry:"白伟",
           intime:"2021/7/9 21:51:22",
           outtime:"2021/7/10 11:00:31",
          },
          {
           sf:"贵州省",
           mkmc:"岩脚煤矿",
           dbld:"蒋志刚",
           dbry:"任润红",
           intime:"2021/7/9 21:51:22",
           outtime:"2021/7/10 11:00:31",
          },
          {
           sf:"陕西省",
           mkmc:"玉华煤矿",
           dbld:"闻万明",
           dbry:"屈明",
           intime:"2021/7/9 21:51:22",
           outtime:"2021/7/10 11:00:31",
          },
          {
           sf:"云南省",
           mkmc:"宏发煤矿",
           dbld:"李守东",
           dbry:"刘彪",
           intime:"2021/7/9 21:51:22",
           outtime:"2021/7/10 11:00:31",
          },
          {
           sf:"贵州省",
           mkmc:"渝兴煤矿",
           dbld:"李守东",
           dbry:"李柱",
           intime:"2021/7/9 21:51:22",
           outtime:"2021/7/10 11:00:31",
          },
          {
           sf:"黑龙江省",
           mkmc:"依兰第二煤矿",
           dbld:"孙武",
           dbry:"李建民",
           intime:"2021/7/9 21:51:22",
           outtime:"2021/7/10 11:00:31",
          },
          {
           sf:"湖南省",
           mkmc:"小乌仙煤矿",
           dbld:"李建民",
           dbry:"周成波",
           intime:"2021/7/9 21:51:22",
           outtime:"2021/7/10 11:00:31",
          },
        ],
        total: 0, //总条数
        currentPage: 1, //当前页码
        pageSize: 10 //每页条数
      },
      diaDetail:{
        show:false,
        name:this.zbjcdata.name,
        title:"",
      }
    };
  },
  mounted() {
    // this.initData();
    // this.initData1();
    // this.initData2();
    if(this.zbjcdata.name=='带班领导巡检不达标'){
      this.table.total = this.table.data.length;
    }
     if(this.zbjcdata.name=='领导带班未巡检'){
      this.table.total = this.table.data1.length;
    }
     if(this.zbjcdata.name=='疑似领导代班'){
      this.table.total = this.table.data2.length;
    }
  },
  computed: {
    // 数据起点
    currentStart() {
      return this.table.total == 0
        ? 0
        : (this.table.currentPage - 1) * this.table.pageSize + 1;
    },
    // 数据终点
    currentEnd() {
      return this.currentStart == 0
        ? 0
        : this.currentStart + this.table.pageSize - 1 > this.table.total
        ? this.table.total
        : this.currentStart + this.table.pageSize - 1;
    }
  },
  methods: {
    openDetail(row){
      this.diaDetail.show = true;
      this.diaDetail.title = row.mkmc+"详情"
    },
    initData() {
      this.request({
        url: "data/getData/3.10",
        method: "get"
      }).then(data => {
        this.diaDetail.data = data.data;
      });
    },
    initData1() {
      this.request({
        url: "data/getData/3.7",
        method: "get"
      }).then(data => {
        this.table.data1 = data.data;
      });
    },
    initData2() {
      this.request({
        url: "data/getData/3.8",
        method: "get"
      }).then(data => {
        this.table.data2 = data.data;
      });
    }
  }
};
</script>
<style lang="less" scoped>
#cqd /deep/ ::-webkit-scrollbar-thumb {
  background-color: #dddddd !important;
}
</style>